*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
html,body{ width: 100%;height: 100%; }
body{font:12px/180% Arial, Helvetica, sans-serif, "微软雅黑";}

.main{position:relative;margin:10px auto;max-width:380px;height:600px;border:1px solid #ccc;overflow:hidden;}
.ph-main{width: 100%;height: 100%;position: relative;border: none; margin: auto;overflow: hidden;}
.container{position:absolute;top:-150px;width:100%;height:auto;}
.row{width:100%;height:150px;}
.cell{float:left;width:25%;height:100%;background-color: #fff;}
.block{background:#ccc;cursor:pointer;}
.mark{ position: absolute; width: 40px; height: 20px; background-color: #e8e8e8;
	border-radius: 50%; top: 10px; left: 50%; margin-left: -20px; text-align: center; line-height: 20px;z-index: 1;}
.mask , .again-mask{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.3);text-align: center;z-index: 2;}
.mask h1 , .again-mask h1{ color: #fff;height: 50px;line-height: 50px;font-family: '微软雅黑';margin-top: 35%; }
.mask span , .again-mask span{ display: block; width: 100px;height: 50px;font-size: 20px; text-align: center; line-height: 50px;margin: 50px auto; background: #4cd964;color: #fff;border-radius: 6px; cursor: pointer; -webkit-box-shadow: 1px 1px 1px #999;box-shadow: 1px 1px 1px #999;text-shadow: 1px 1px 1px #fff; }
.again-mask h2{ color: #fff;height: 45px;line-height: 45px;font-family: '微软雅黑';}